<div class="left-sidebar" id="left-sidebar" role="navigation">
    <div class="narrows_panel">
        <ul id="global_filters" class="filters">
            {# Special-case this link so we don't actually go to page top. #}
            <li class="top_left_all_messages top_left_row" title="{{ _('All messages') }} (a)">
                <a href="#all_messages" class="home-link">
                    <span class="filter-icon">
                        <i class="fa fa-align-left" aria-hidden="true"></i>
                    </span>
                    {#- squash whitespace -#}
                    <span>{{ _('All messages') }}</span>
                    <span class="count">
                        <span class="value"></span>
                    </span>
                </a>
                <span class="arrow all-messages-sidebar-menu-icon"><i class="zulip-icon ellipsis-v-solid" aria-hidden="true"></i></span>
            </li>
            <li class="top_left_private_messages">
                <div class="private_messages_header top_left_row" title="{{ _('Private messages') }} (P)">
                    <a href="#narrow/is/private">
                        <span class="filter-icon">
                            <i class="fa fa-envelope" aria-hidden="true"></i>
                        </span>
                        {#- squash whitespace -#}
                        <span>{{ _('Private messages') }}</span>
                        <span class="count">
                            <span class="value"></span>
                        </span>
                    </a>
                </div>
                <div id="private-container" class="scrolling_list" data-simplebar>
                </div>
            </li>
            <li class="top_left_mentions top_left_row">
                <a href="#narrow/is/mentioned">
                    <span class="filter-icon">
                        <i class="fa fa-at" aria-hidden="true"></i>
                    </span>
                    {#- squash whitespace -#}
                    <span>{{ _('Mentions') }}</span>
                    <span class="count">
                        <span class="value"></span>
                    </span>
                </a>
            </li>
            <li class="top_left_starred_messages top_left_row">
                <a href="#narrow/is/starred">
                    <span class="filter-icon">
                        <i class="fa fa-star" aria-hidden="true"></i>
                    </span>
                    {#- squash whitespace -#}
                    <span>{{ _('Starred messages') }}</span>
                    <span class="count">
                        <span class="value"></span>
                    </span>
                </a>
                <span class="arrow starred-messages-sidebar-menu-icon"><i class="zulip-icon ellipsis-v-solid" aria-hidden="true"></i></span>
            </li>
            <li class="top_left_recent_topics top_left_row" title="{{ _('Recent topics') }} (t)">
                <a href="#recent_topics">
                    <span class="filter-icon">
                        <i class="fa fa-clock-o" aria-hidden="true"></i>
                    </span>
                    {#- squash whitespace -#}
                    <span>{{ _('Recent topics') }}</span>
                </a>
            </li>
        </ul>
        <div id="streams_list" class="zoom-out">
            <div id="streams_header" class="zoom-in-hide"><h4 class="sidebar-title tippy-zulip-tooltip" data-tippy-content="{{ _('Filter streams') }} (q)">{{ _('STREAMS') }}</h4>
                <i id="streams_inline_cog" class='fa fa-cog tippy-zulip-tooltip' aria-hidden="true" data-tippy-content="{{ _('Subscribe, add, or configure streams') }}"></i>
                <i id="streams_filter_icon" class='fa fa-search tippy-zulip-tooltip' aria-hidden="true" data-tippy-content="{{ _('Filter streams') }} (q)"></i>
                <div class="input-append notdisplayed stream_search_section">
                    <input class="stream-list-filter home-page-input" type="text" autocomplete="off" placeholder="{{ _('Search streams') }}" />
                    <button type="button" class="btn clear_search_button" id="clear_search_stream_button">
                        <i class="fa fa-remove" aria-hidden="true"></i>
                    </button>
                </div>
            </div>
            <div id="topics_header">
                <a href="" class="show-all-streams"> <i class="fa fa-chevron-left" aria-hidden="true"></i>{{ _('Back to streams') }}</a>
            </div>
            <div id="stream-filters-container" class="scrolling_list" data-simplebar>
                <ul id="stream_filters" class="filters"></ul>
            </div>
            {% if show_add_streams %}
            <div id="add-stream-link">
                <a href="#streams/all"><i class="fa fa-plus-circle" aria-hidden="true"></i>{{ _('Subscribe to more streams') }}</a>
            </div>
            {% endif %}
        </div>
    </div>
</div>
